<template>
  <el-card shadow="never" class="aui-card--fill">
    <h3 v-if="showNo" style="margin-top: 0">{{ $route.params.mtNo }}</h3>
    <div class="mod-wms__order-detail}">
      <el-upload :action="uploadUrl" :on-change="handleChange" style="margin-bottom: 10px">
        <el-button size="small" type="primary" plain>点击上传</el-button>
      </el-upload>
      <wms-form v-model="dataForm" :formList="formList" :table-column="tableColumn" :advanced="advanced"
        @check-change="checkChange" @changeAdvance="changeAdvance" @getDataList="getDataList" @getReset="getReset">
        <template>
          <el-button size="mini" type="primary" plain @click="stockAllot">转库
          </el-button>
          <el-button size="mini" type="primary" plain @click="exportHandle">记录导出
          </el-button>
        </template>
      </wms-form>
      <wms-table ref="wmsTable" class="wmsTable" v-model="dataForm" :page="page" :total="total" :limit="limit"
        :tableData="dataList" :table-column="column" :module-options="mixinViewModuleOptions"
        :dataListLoading="dataListLoading" :showSelection="showNo" @deleteHandle="deleteHandle"
        @pageSizeChangeHandle="pageSizeChangeHandle" @pageCurrentChangeHandle="pageCurrentChangeHandle"
        @selectChangeHandle="selectChangeHandle">
      </wms-table>
      <!-- 弹窗, 新增 / 修改 -->
    </div>
  </el-card>
</template>

<script>
import mixinViewModule from "@/mixins/view-module";
import { formList, tableColumn } from "./config";
import wmsTable from "@/components/wms-table";
import wmsForm from "@/components/wms-form";
export default {
  mixins: [mixinViewModule],
  data() {
    return {
      mixinViewModuleOptions: {
        createdIsNeed: false,
        getDataListURL: "/wms/allot-record/page",
        getDataListIsPage: true,
        exportURL: "/wms/allot-record/export",
        deleteURL: "/wms/allot-record",
        deleteIsBatch: true,
        deleteIsBatchKey: "id",
      },
      formList,
      tableColumn,
      showNo: true,
      dataForm: {
        id: '',
        allotNo: '',
        spuNo:'',
        locate:'',
        status:'',
      },
      //存放上传文件
      fileList: [],
      uploadUrl: '/wms/allot-record/import',
      maxFileLength: 1
    };
  },
  components: {
    wmsTable,
    wmsForm,
  },
  created() {
    this.query();
  },
  methods: {
    handleChange(file, fileList) {
      let length = fileList.length;
      this.maxFileLength = Math.max(length, this.maxFileLength)
      setTimeout(() => {
        if (this.maxFileLength !== length) {
          return
        }
        fileList.forEach(item => {
          this.fileList.push(item.raw)
          // 文件选择后的回调
          this.uploadFile(file.raw); // 直接上传文件
        })
      }, 0)
    },
    beforeUpload(file) {
      // 如果需要的话，可以在这里进行文件校验
      // return false 则停止上传
    },
    uploadFile(file) {
      const formData = new FormData();
      formData.append('file', file);
      this.$http.post(this.uploadUrl, formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      }).then(({ data: res }) => {
        if (res.code != 0) {
          return this.$message.error(res.msg);
        }
        this.$message({
          message: res.msg,
          type: "success",
          duration: 5000,
          onClose: () => {
            this.getDataList();
          },
        });
      })
        .catch(error => {
          console.error('上传失败', error);
        });
    },

    // 单选
    selectChangeHandle(selection, row) {
      console.log(row);
      this.dataForm.id = row.id; //每次单选都重置id
      this.dataForm.allotNo = row.allotNo;
    },

    //大库转小库
    stockAllot() {
      if (this.dataForm.id.length == 0 || this.dataForm.allotNo.length == 0) {
        this.$message({
          message: '请选择调拨单',
          type: 'error',
          center: true,
          showClose: true
        })
      }
      else {
        this.$http['post']('/wms/allot-record/allot', this.dataForm).then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message({
              message: res.msg,
              type: 'error',
              duration: 5000,
            })
          }
          this.$message({
            message: res.data,
            type: 'success',
            duration: 5000,
            onClose: () => {
              this.visible = false
            }
          })
        }).catch(() => { })
      }
    },
  },
};
</script>
<style scoped>
/* 隐藏表头的全选框 */
/*::v-deep .wmsTable thead .el-table-column--selection .cell {
  display: none;
}*/

::v-deep .wmsTable thead .el-table-column--selection .cell {
  display: none;
}
</style>
